<template>
  <Modal
    v-model:active="idManagerModalActive"
    title="重新编号"
    :width="480"
    :height="450"
    draggable
    hide-mask
    :loading="loading"
    @confirm="executeIDManager"
  >
    <NativeScroll use-y-bar height="100%" scroll-style="padding: 24px;">
      <Row :gap="[8]">
        <ConfigProvider :props="providedProps">
          <Form :model="formModel">
            <Column :span="24">
              <div class="title">
                <div class="title_color"></div>
                <div class="title_content">选择器</div>
              </div>
            </Column>
            <Column :span="24">
              <RadioGroup
                v-model:value="formModel.entityType"
                @change="radioGroupChange"
              >
                <Radio v-for="item in items" :key="item" :label="item">
                  {{ item }}
                </Radio>
              </RadioGroup>
            </Column>
            <Divider></Divider>
            <Column :span="24">
              <div class="title">
                <div class="title_color"></div>
                <div class="title_content">选项</div>
              </div>
            </Column>
            <Column :span="24">
              <FormItem label="初始值:" prop="input" :required="true">
                <Input placeholder="初始值" v-model:value="formModel.startId" />
              </FormItem>
            </Column>
            <Column :span="24">
              <FormItem label="增量:" prop="input" :required="true">
                <Input placeholder="增量" v-model:value="formModel.increment" />
              </FormItem>
            </Column>
            <Column :span="24">
              <FormItem label="偏移:" prop="input" :required="true">
                <Input
                  placeholder="偏移"
                  v-model:value="formModel.offsetValue"
                />
              </FormItem>
            </Column>
          </Form>
        </ConfigProvider>
      </Row>
    </NativeScroll>
  </Modal>
</template>
<script lang="ts" setup>
import {
  Modal,
  Divider,
  Form,
  FormItem,
  ConfigProvider,
  Input,
  Radio,
  RadioGroup,
  NativeScroll,
  Row,
  Column,
  Message,
  Toast,
} from "cax-ui";
import { ref } from "vue";
import { useCoreStore, _global } from "@/UI/store";
import { storeToRefs } from "pinia";
import { submitTask, isExist, getTaskStatus } from "@/UI/api/shuqiao";
import { STATUS_CODE } from "@/FrontProcessing";
const coreStore = useCoreStore();
const { idManagerModalActive } = storeToRefs(coreStore);
const loading = ref(false);
const providedProps = {
  default: { clearable: true },
  formItem: { required: true },
};

let formModel = {
  entityType: "节点",
  startId: 1,
  increment: 1,
  offsetValue: 1,
};

const items = ["节点", "单元", "属性"];

function executeIDManager() {
  _global.Engine.defeature
    .id_manager({
      entityType: formModel.entityType,
      increment: formModel.increment,
      startId: formModel.startId,
      offsetValue: formModel.offsetValue,
    })
    .then((result: any) => {
      console.log("result", result);
      coreStore.setBomInfo(result);
      if (result) {
        Message.success("编号成功");
      }
    })
    .catch((err) => {
      Message.error(err);
    })
    .finally(() => {
      loading.value = false;
      Toast.close();
    });
}

const selectMeshByBoxStatus = ref(false);
// 框选网格交叉点
const selectMeshPointByBoxStatus = ref(false);
// 选择网格节点（鼠标点选）
const normalSelectMeshPointStatus = ref(false);

function changeBoxStatus(type: string) {
  if (selectMeshByBoxStatus.value || selectMeshPointByBoxStatus.value) {
    // 取消框选
    _global.Engine.registerNormalRightClick(); // 恢复normal右键鼠标事件
    selectMeshByBoxStatus.value = false;
    selectMeshPointByBoxStatus.value = false;
    _global.Engine.selectBoxComp.disableSelectBox();
  } else {
    // 解除点选
    if (normalSelectMeshPointStatus.value) {
      _global.Engine.state.set("Mode", STATUS_CODE.NORMAL);
      normalSelectMeshPointStatus.value = false;
      _global.Engine.unregisterSelectPointRightClick(); // 解除 selectPoint 右键鼠标事件
    }
    // 启动框选
    _global.Engine.unregisterNormalRightClick(); // 注销normal右键鼠标事件
    switch (type) {
      case "mesh":
        selectMeshByBoxStatus.value = true; // 框选网格 图标置灰
        break;
      case "meshPoint":
        selectMeshPointByBoxStatus.value = true; // 框选网格点 图标置灰
        break;
    }
    _global.Engine.selectBoxComp.enableSelectByBox(type);
  }
}

// 选择网格节点（鼠标点选）
function selectPointStatus() {
  if (normalSelectMeshPointStatus.value) {
    // 解除点选
    normalSelectMeshPointStatus.value = false;
    _global.Engine.state.set("Mode", STATUS_CODE.NORMAL);
    _global.Engine.unregisterSelectPointRightClick(); // 注销 selectPoint 右键鼠标事件
    _global.Engine.registerNormalRightClick(); // 注册normal右键鼠标事件
  } else {
    // 解除框选
    selectMeshByBoxStatus.value = false;
    selectMeshPointByBoxStatus.value = false;
    _global.Engine.selectBoxComp.disableSelectBox();
    // 激活点选
    normalSelectMeshPointStatus.value = true;
    _global.Engine.state.set("Mode", STATUS_CODE.VERTEX_SELECT);
    _global.Engine.unregisterNormalRightClick(); // 注销 normal 右键鼠标事件
    _global.Engine.registerSelectPointRightClick(); // 注册 selectPointc 右键鼠标事件
  }
}

function radioGroupChange(value: any) {
  console.log("value", value);
  switch (value) {
    case "节点":
      selectPointStatus();
      return;
    case "单元":
      changeBoxStatus();
      return;
    case "属性":
      return;
  }
}
</script>
<style lang="less" scoped>
.file-select {
  width: 500px;
}
</style>
